<template>
  <div id="year"></div>
</template>

<script>
export default {
  name: 'Year',
  mounted() {
    this.createEcharts()
  },
  methods: {
    createEcharts() {
      let myChart = this.$echarts.init(document.getElementById('year'), 'dark')
      myChart.setOption({
        tooltip: {
          trigger: 'item',
        },
        series: [
          {
            name: '产生年代',
            type: 'pie',
            radius: '65%',
            data: [
              { value: 3434, name: '当代' },
              { value: 3224, name: '中华民国' },
              { value: 6334, name: '清朝' },
              { value: 2552, name: '明朝' },
              { value: 341, name: '元朝' },
              { value: 2552, name: '宋辽西夏金时期' },
              { value: 844, name: '隋唐五代时期' },
              { value: 373, name: '三国两晋南北朝' },
              { value: 368, name: '秦汉时期' },
              { value: 272, name: '先秦时期' },
              { value: 149, name: '夏商周' },
              { value: 262, name: '新石器时代' },
              { value: 17, name: '旧石器时代' },
              { value: 3030, name: '无法确定(长时段)' },
            ],
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)',
              },
            },
          },
        ],
        backgroundColor:'' //设置无背景色
      })
    },
  },
}
</script>

<style>
#year {
  height: 100%;
}
</style>
